<template>
  <div class="add">
    <div class="add-title">
      <img src="../assets/img/add/choosebb.png" alt="" />
    </div>
    <div class="left-title">
      <div
        class="item"
        v-for="(item, index) in baziList"
        :key="index"
        @click="changeBazi(index)"
        :class="ids === index ? 'active' : ''"
      >
        {{ item }}
      </div>
    </div>
    <!-- 详情 -->

    <div class="left-box">
      <!-- 切换 -->
      <div
        v-show="isOne"
        class="box-item"
        v-for="(item, index) in baziMessage"
        @click.once="dianji(index)"
        :class="{ liang: arr1.includes(index) }"
        :key="item.id"
      >
        {{ item.name }}
      </div>
      <div
        v-show="isTwo"
        class="box-item"
        v-for="(item, index) in baziMessage2"
        @click.once="dianji(index)"
        :class="{ liang: arr1.includes(index) }"
        :key="item.id"
      >
        {{ item.name }}
      </div>
      <div
        v-show="isThr"
        class="box-item"
        v-for="(item, index) in baziMessage3"
        @click.once="dianji(index)"
        :class="{ liang: arr1.includes(index) }"
        :key="item.id"
      >
        {{ item.name }}
      </div>
      <div
        v-show="isFour"
        class="box-item"
        v-for="(item, index) in baziMessage4"
        @click.once="dianji(index)"
        :class="{ liang: arr1.includes(index) }"
        :key="item.id"
      >
        {{ item.name }}
      </div>
      <div
        v-show="isFive"
        class="box-item"
        v-for="(item, index) in baziMessage5"
        @click.once="dianji(index)"
        :class="{ liang: arr1.includes(index) }"
        :key="item.id"
      >
        {{ item.name }}
      </div>
      <div
        v-show="isSix"
        class="box-item"
        v-for="(item, index) in baziMessage6"
        @click.once="dianji(index)"
        :class="{ liang: arr1.includes(index) }"
        :key="item.id"
      >
        {{ item.name }}
      </div>
      <div
        v-show="isEve"
        class="box-item"
        v-for="(item, index) in baziMessage7"
        @click.once="dianji(index)"
        :class="{ liang: arr1.includes(index) }"
        :key="item.id"
      >
        {{ item.name }}
      </div>
    </div>
    <div class="left-choose">
      <div class="ch-title">已选择：</div>
      <!-- 选中框1 -->
      <div class="ch-save">
        <p>侧转靶：<span>标靶1 标靶2</span></p>
      </div>
    </div>
    <div class="add-title">
      <img src="../assets/img/add/fzmc.png" alt="" />
    </div>
    <!-- 输入框 -->
    <el-input placeholder="几次隐靶" v-model="input3" clearable> </el-input>
    <div class="btnbox">
        <div class="saves" @click="save">
            <img src="../assets/img/add/saves.png" alt="">
        </div>
        <div class="none" @click="none()">
            <img src="../assets/img/add/none.png" alt="">
        </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "",
  data() {
    return {
     
    };
  },
  components: {},
  mounted() {},
  methods: {
    
    save(){
        this.$emit('goset',1)
        console.log(1111);

    }
  },
};
</script>


